import React, { Component } from 'react';
import { Layout, Menu, Icon, Pagination, Row, Col, Avatar, Button, Input } from 'antd';
const { SubMenu } = Menu;
const { Content, Sider } = Layout;

export default class Blog extends Component {
  render() {
    return(
      <Layout style={{ padding: '24px 0', background: '#fff' }}>
        <Content style={{ padding: '0 24px', minHeight: 280 }}>
          <div>
            <ul>
              <li>
                <Row>
                  <Col span={6} style={{ minHeight: '150px', borderRight: '1px solid #ddd' }}>
                    <p style={{ textAlign: 'center' }}><Avatar size="large" /></p>
                    <p style={{ textAlign: 'center' }}>Sma2lBao</p>
                    <p style={{ marginTop: '5px', textAlign: 'center' }}>
                      <span>创建于：</span><span>2017-09-04 11:23</span>
                    </p>
                    <p style={{ textAlign: 'center', marginTop: '10px' }}>
                      <span><Icon type="like-o" />   0</span>
                      <span style={{ marginLeft: '20px' }}><Icon type="message" /> 0</span>
                    </p>
                  </Col>
                  <Col span={18} style={{ padding: '5px 10px' }}>
                    <h3>文章题目</h3>
                    <p>
                      博客缩写博客缩写博客缩写博客缩写博客缩写博客缩写博客缩写博客缩写博客缩写博客缩写
                      博客缩写博客缩写博客缩写博客缩写博客缩写博客缩写博客缩写博客缩写博客缩写博客缩写
                      博客缩写博客缩写博客缩写博客缩写博客缩写博客缩写博客缩写博客缩写博客缩写博客缩写
                    </p>
                    <a>阅读全文</a>
                  </Col>
                </Row>
              </li>
            </ul>
            <p style={{ textAlign: 'right' }}>
              <Pagination defaultCurrent={1} total={50} />
            </p>
          </div>
        </Content>
      </Layout>
    );
  }
}
